<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<title>添加商品</title>
	<style>
		#oad {
			margin: 20px;
			padding: 20px;
			border: 1px solid #ccc;
			border-radius: 5px;
			background-color: #f9f9f9;
			width: 950px;
		}
		label {
			display: block;
			margin-bottom: 10px;
			font-weight: bold;
		}
		input[type="text"], select {
			display: block;
			margin-bottom: 10px;
			padding: 5px;
			border: 1px solid #ccc;
			border-radius: 3px;
			width: 100%;
			box-sizing: border-box;
		}
		input[type="button"] {
			background-color: #fbc2eb;
			color: white;
			padding: 10px 20px;
			border: none;
			border-radius: 3px;
			cursor: pointer;
		}
		input[type="button"]:hover {
			background-color: rgb(255, 128, 192);
		}
	</style>
	<script type="text/javascript" src="js/vue-2.6.10.js"></script>
	<script type="text/javascript" src="js/axios.js"></script>
</head>
<body>
	<div id="oad">
		<label for="oUser">收件人姓名：</label>
				<input type="text" id="oUser" name="oUser" v-model='order.oUser' required><br>
				<label for="oNumber">订单编号：</label>
				<input type="text" id="oNumber" name="oNumber" v-model='order.oNumber' required><br>
				<label for="oName">商品名称：</label>
				<input type="text" id="oName" name="oName" v-model='order.oName' required><br>
				<label for="oMoney">总价：</label>
				<input type="text" id="oMoney" name="oMoney" v-model='order.oMoney' required><br>
				<input type="button" value="保存" @click="addorder" >
	</div>
	<script type="text/javascript">
	let vue = new Vue({
  		  el:'#oad',
  		  data:{
  			  order:{
  				  
  				  oUser:'',
  				  oNumber:'',
  				  oName:'',
  				  oMoney:''
  				  
  				  
  			  }
  		  },
  		  
  		   methods: {
  			  addorder: function(){
  				param = "oUser="+vue.order.oUser+"&oNumber="+vue.order.oNumber+"&oName="+vue.order.oName+"&oMoney="+vue.order.oMoney;
  				axios.post('/OrderServert/orderser.do?'+param).then(
	  				function(res_obj){
	  					
	  					window.location.href="order.html";
	  				}	  
	  			  ).catch(
							function(error_obj){
								alert("数据加载异常！！！");
							}
					)
  			  }
  			  
  		  }
  	  });
  	  </script>
</body>
</html>